<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>领料单</title>
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <script src="../js/use_rem.js"></script>
    <link rel="stylesheet" href="../css/reset.css">

    <style>
        html,body{
            width: 100%;
            height: 100%;
        }
        .main_header{
            font-size: 1.6rem;
            text-align: center;
            margin-top: 5rem;
        }
        .main_header_time{
            font-size: 1.2rem;
            margin-top: 1rem;
            text-align: center;
            margin-bottom: 3.4rem;
        }
        .table{
            width: 94%;
            border:0;
            margin: 0 auto;
        }
        .t_header_c{
            color: #FFFFFF;
            background-color: #fa3d3d;
            height: 3.5rem;
            line-height: 3.5rem;
            border: 0;
            text-align: center;
        }
        .list_top_header .t_header_c{
            border:  0 ;
        }
        .table tr{
            border:  0 ;
        }
        /*loading*/
        .spinner {
            width: 6rem;
            height:6rem;
            position: absolute;
            top:50%;
            left:50%;
            background-color: #ef8f86;
            margin-left: -3rem;
            margin-top: -3rem;
            /*margin: 100px auto;*/
            -webkit-animation: rotateplane 1.2s infinite ease-in-out;
            animation: rotateplane 1.2s infinite ease-in-out;
        }

        @-webkit-keyframes rotateplane {
            0% { -webkit-transform: perspective(120px) }
            50% { -webkit-transform: perspective(120px) rotateY(180deg) }
            100% { -webkit-transform: perspective(120px) rotateY(180deg)  rotateX(180deg) }
        }

        @keyframes rotateplane {
            0% {
                transform: perspective(120px) rotateX(0deg) rotateY(0deg);
                -webkit-transform: perspective(120px) rotateX(0deg) rotateY(0deg)
            } 50% {
                  transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg);
                  -webkit-transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg)
              } 100% {
                    transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);
                    -webkit-transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);
                }
        }
        /*loading*/
        .t_header_c{
            max-width: 10%;
        }
    </style>
</head>
<body>
<script id="getColumnTableData_a_q_l" type="text/x-handlebars-template">
    {{#each data}}
    <tr class="delect_add">
        <td class="col-1 sequence max_w_limit">{{seq_num @index}}</td>
        {{#packer_c   first}}
        <td class="col-1 sequence max_w_limit" rowspan="{{num_f}}">{{first}}</td>
        {{/packer_c}}
        {{#packer_c   sec}}
        <td class="col-1 sequence max_w_limit" rowspan="{{mun_sec}}">{{sec}}</td>
        {{/packer_c}}
        <td class="col-1 sequence max_w_limit">{{food_name}}</td>
        <td class="col-1 sequence max_w_limit">{{dw}}</td>
        <td class="col-1 sequence max_w_limit">
            {{remaining_amount}}
        </td>
        <!--fmtDate-->
    </tr>
    {{/each}}
</script>
<div class="wrap">
     <div class="header">
         <p class="main_header res_top_p1">
             东二食堂烧腊档口领料单
         </p>
         <p class="main_header_time res_top_pw">
             2017年7月12日
         </p>
         <table class="table table-border table-bordered table-bgcolor-gary"  border = "0">
             <thead class="text-c row cl" id="ColumnTableData_comment_a_q_l">
             <tr class="list_top_header list_top_header">
                 <th class="col-1 t_header_c">序号</th>
                 <th class="col-1 t_header_c">一级类目</th>
                 <th class="col-1 t_header_c">二级类目</th>
                 <th class="col-1 t_header_c">商品名称</th>
                 <th class="col-1 t_header_c">单位</th>
                 <th class="col-1 t_header_c">单价</th>
                 <th class="col-1 t_header_c">数量</th>
                 <th class="col-1 t_header_c">总价</th>
                 <th class="col-1 t_header_c">备注</th>
             </tr>
             </thead>
         </table>
     </div>
</div>
<div class="spinner"></div>
</body>

<script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
<script src="../js/handlebars.js"></script>
<script>
        var date = new  Date()
        var now_date_show =date.getFullYear()+"年"+(date.getMonth()+1)+"月"+date.getDate()+"日";
        $(".res_top_pw")[0].innerText = now_date_show
        var hebing_or_not = {};
        Handlebars.registerHelper ("packer_c",function(value,options){
            if(hebing_or_not[value] == true){
                hebing_or_not[value] = false;
                return options.fn(this);
            }
            return options.inverse(this);
        })

        $.ajax({
            url:"/easy_stock/sales/voucher/get?voucher_id=1",
            method:"get",
            success:function (e) {
                console.log(e)
                var name = e.data.canteen_name +
                    '<span>&nbsp;&nbsp;&nbsp;</span>'
                    + e.data.warehouse_name
                $(".res_top_p1")[0].innerHTML = name
                $(".spinner")[0].style.display="none";
                if(e.code == 0) {
                    var the_min_goods = [];
                    var num_f = 0
                    var num_sec = 0
                    var data = {}
                    var data_last = {}
                    var data_inner = {}
                    for (var x = 0; x < e.data.record_info.length; x++) {
                        console.log("record)_)_)__)__)_")
                        console.log(x);
                        var big_name = 'big_' + x;
                        hebing_or_not[e.data.record_info[x].name] = true;
                        hebing_or_not[e.data.record_info[x][x]] = true;

                        for (var c = 0; c < e.data.record_info[x].subcategory.length; c++) {
                            console.log("record_+_++_+_+_+_+_+_+_+_+_+_+_+_=")
                            num_sec = 0;
                            hebing_or_not[e.data.record_info[x].subcategory[c].name] = true;

                            data_last = {
                                mun_sec: num_sec+=parseInt(e.data.record_info[x].subcategory[c].record_info.length)
                            }

                            console.log("ssssssssssss")
                            console.log(data_last.mun_sec)
                            for (var m = 0; m < e.data.record_info[x].subcategory[c].record_info.length; m++) {
                                hebing_or_not[e.data.record_info[x].subcategory[c].record_info[m].name] = true;
//                        console.log(e.data.warehouse_info[x].subcategory[c].food_list.)
                                //循环subcategory 获取信息
                                for (var cc = 0; cc < e.data.record_info[x].subcategory.length; cc++) {
                                    data = {
                                        num_f: (num_f += parseInt(e.data.record_info[x].subcategory[cc].record_info.length))
                                    }
                                }

                                data = $.extend(data, data_last)
//                        for(var ff=0; ff<e.data.warehouse_info[x].subcategory[c].food_list[m].record_list.length;ff++){
                                data_inner = {
                                    first: e.data.record_info[x].name,
                                    index: e.data.record_info[x].name,
                                    sec: e.data.record_info[x].subcategory[c].name,
                                    thr: e.data.record_info[x].subcategory[c].record_info[m].name,
                                    dw: e.data.record_info[x].subcategory[c].record_info[m].unit,
                                    num_last:e.data.record_info[x].subcategory[c].record_info[m],
                                    id: e.data.record_info[x].subcategory[c].record_info[m].id,
                                    amount: e.data.record_info[x].subcategory[c].record_info[m].amount,
                                    price: e.data.record_info[x].subcategory[c].record_info[m].price,
                                    sum: e.data.record_info[x].subcategory[c].record_info[m].sum,
                                    remaining_amount: e.data.record_info[x].subcategory[c].record_info[m].remaining_amount,
                                    food_name: e.data.record_info[x].subcategory[c].record_info[m].food_name
                                }
                                var data_all = $.extend(data, data_inner)
//                            console.log("333333333333333111111222222222")
                                //console.log(parseInt(e.data.warehouse_info[x].subcategory[c].food_list.length))
                                the_min_goods.push(data_all);
//                        }
                            }
                        }
                    }
                    console.log(the_min_goods)
                    getHtmlFromLocalTemplate({   //将数据打包到模版丢进容器
                        templateId: "getColumnTableData_a_q_l",
                        container: $("#ColumnTableData_comment_a_q_l"),
                        data: {data: the_min_goods},
                        append: 1,//append
                        callback: function () {

                        }
                    })
                }else{

                }
            },error:function (e) {
                $(".spinner")[0].style.display="none";
                console.log(e)
            }
        })
    function getHtmlFromLocalTemplate(opt){
        opt.append = opt.append || 0;//现在是否要append
        if(opt.data===null){opt.data=''}
        // console.log(:)
        if(opt.templateId && $("#" + opt.templateId).length > 0){
            var template = Handlebars.compile($("#" + opt.templateId).html());
            if(opt.append == 1){
                $(".delect_add").remove()
                opt.container && opt.container.append(template(opt.data));//插在后面
            }else{
                opt.container && opt.container.html(template(opt.data));//替换
            }

            if(opt.callback && $.isFunction(opt.callback)){
                opt.callback();
            }
        }
    }
    Handlebars.registerHelper ("seq_num",function(value){
            return  value+1
    })
    //显示合并


</script>
</html>